@import './config';

.arrow {
  display: inline-block;
  width: 0;
  height: 0;

  &.up {
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-bottom: 6px solid $arrowBgColor;
  }

  &.down {
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-top: 6px solid $arrowBgColor;
  }

  &.right {
    border-top: 4px solid transparent;
    border-bottom: 4px solid transparent;
    border-left: 6px solid $arrowBgColor;
  }

  &.left {
    border-top: 4px solid transparent;
    border-bottom: 4px solid transparent;
    border-right: 6px solid $arrowBgColor;
  }
}
